<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>其卡通</title>
    <link rel="stylesheet" href="css/bootstrap.css">
    <link rel="stylesheet" href="css/public.css">
    <link rel="stylesheet" href="css/index.css">
    <script src="js/jquery-3.2.1.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/public.js"></script>
    <script src="js/imgControl.js"></script>
    <script src="js/main.js"></script>
</head>
<body>
<div class="main-wrapper">
    <div class="header">
        <nav class="navbar navbar-default navbar-fixed-top">
            <div class="container-fluid">
                <!-- 小屏幕适应 -->
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
                            data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="index-main.html"><img src="img/logo.png" alt=" "></a>
                </div>
                <!-- Collect the nav links, forms, and other content for toggling -->
                <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                    <ul class="nav navbar-nav pull-right header-ul">
                        <li><a href="us.html" class="active us" id="txUs"> 我们 </a></li>
                        <li><a class="production" id="txProduction">作品</a></li>
                        <li><a class="highlights" id="txHightlight">亮点</a></li>
                        <li><a href="qiuxian.html" class="recruit" id="txrecruit">求贤</a></li>
                        <li><a href="cooperation.html" class="cooperation" id="txCoop">合作</a></li>
                    </ul>
                </div><!-- /.navbar-collapse -->
            </div><!-- /.container-fluid -->
        </nav>
    </div>
    <div class="containt st-scroll">
        <div class="st-panel" id="st-panel-1">
            <a name="#us">
            <div class="person">
                <a href="us.html">
                    <img src=" " alt=" " id="headPeople">

                </a>
            </div>
            </a>
            <div class="first-tv">
                <div class="befor-cat"></div>
                <p>ITS CARTOON</p>
                <div class="headposter"><img src=""></div>
                <div class="headshipinmask"></div>
                <div class="headshipincontrol">
                    <video src=" "></video>
                </div>

                <div class="first-tv-p">
  <!--                  <p>“其卡通”的英文名字：ITS CARTOON，ITS是“将梦想变成现实”的英文缩写其卡通动画，中国顶尖的动画团队。已由2002年成立时的8人发展到现 在的百余人。从一开始的《快乐东西》《马小跳》到后来的《桂宝之爆笑闯宇宙》神秘世界历险记》等一系列作品，都获得了巨大的关注。
                    </p>-->
                    <img src="./img/zhuyeyou.png" alt=" ">
                </div>
            </div>
        </div>
        <div class="pinkMask" style="position: absolute;top: 872px;width: 100%;height: 192px;background-color: #f7e7e9;"></div>
        <div class="st-panel st-color" id="st-panel-2">
            <div class="main-btn">
                <div id="movies" class="active">动画电影</div>
                <div id="tv-play" class="">动画TV</div>
                <div id="short-film" class="">动画短片</div>
                <div id="advertise" class="">动画广告</div>
            </div>
            <div class="movies-1">
                <div class="big_pic" id="movie12">
                    <a name="#movie12" ><img src="" alt=" " class="movies-1-bg"></a>
                </div>
                <a href="movie.html"><img src=" " class="headpeople"></a>
                <div class="movies1Poster"><img src=""></div>
                <div class="shipinmask"></div>
                <div id="shipin">
                    <video src=""></video>
                </div>
                <img src="./img/btn-left.png" alt=" " class="prev1">
                <div class="img-control">
                    <div class="control-ul-wid">
                        <ul class="fan">
                        </ul>
                    </div>
                </div>
                <img src="./img/btn-right.png" alt=" " class="next1">
            </div>
            <div class="movies-3">
                <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
                    <!-- Wrapper for slides -->
                    <div class="carousel-inner tvlun" role="listbox">
                        <!--                    <div class="item active first-one">
                                                    <div id="tvshipin">
                                                        <video src="./video/02.MOV" style="width: 60%"；></video>
                                                    </div>

                                                    <div class="carousel-caption">
                                                        <div class="mov-number">
                                                            <a href="">第一部</a>
                                                            <a href="">第二部</a>
                                                            <a href="">第三部</a>
                                                        </div>
                                                        <div class="mov-img">
                                                            <img src="./img/happy%20stuff_00088%20.jpg" alt="">
                                                            <img src="./img/happy%20stuff%20POP5002.jpg" alt="">
                                                            <img src="./img/005.jpg" alt="">
                                                        </div>
                                                        <div class="mov-word">
                                                            <h2>快乐东西</h2>
                                                            <p>《快乐东西》是一部动画情景喜剧，描述了中国老北京胡同中，一对孪生兄妹的家庭生活，人物个性鲜明、生活气息浓郁，诙谐幽默却又不失哲理，在爆笑的同时突出刻画中国人特有的亲情、友情与爱情观念，使人在放声大笑的同时，领悟出真正的生活内涵。该动画以一个轻松的主题，创造了中国首部大型动画情景喜剧的广阔天空，其幽默、前卫，内容传统、简单、生活化，语言诙谐，贴近生活。在动画中中国式的人物造型、中国式的绘画风格、中国式的都市情节，都勾画出了其独有的中国特色。</p>
                                                        </div>
                                                    </div>
                                                </div>-->
                        <!--<div class="item first-one">
                            <video src="./video/02.MOV" style="width: 60%"；></video>
                            <div class="carousel-caption">
                                <div class="mov-number">
                                    <a href="">第一部</a>
                                    <a href="">第二部</a>
                                    <a href="">第三部</a>
                                    <a href="">第四部</a>
                                    <a href="">第五部</a>
                                </div>
                                <div class="mov-img">
                                    <img src="./img/happy%20stuff_00088%20.jpg" alt="">
                                    <img src="./img/happy%20stuff%20POP5002.jpg" alt="">
                                    <img src="./img/005.jpg" alt="">
                                </div>
                                <div class="mov-word">
                                    <h2>风花仙子外传</h2>
                                    <p>本剧涉及主要人物上百多个，对人物性格及命运进行了精彩演绎，并注入时尚元素，情节轻 松，对白搞笑，故事场景跨越天宫、古代与现代，并融入时下流行的热门事件及语言，以轻松调侃的方式演绎了赵钱孙李四大家族恩怨情仇的曲折故事……</p>
                                </div>
                            </div>
                        </div>-->
                    </div>

                    <!-- Controls -->
                    <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
                        <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
                        <span class="sr-only">Previous</span>
                    </a>
                    <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
                        <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
                        <span class="sr-only">Next</span>
                    </a>
                </div>
            </div>
            <div class="movies-2">
                <div class="big-bg2">
                    <img src="" alt="" class="movies-2-bg">
                </div>
                <div class="movies-2-control">
                    <div class="shortBeside"><img src="./img/shortcebian.png"></div>
                    <div class="shortposter"><img src=""></div>

                    <div class="shipinmask2"></div>
<!--                    <div class="turnout">
                        <div class="turnoutson">
&lt;!&ndash;                            <div><a >1</a></div>
                            <div><a >2</a></div>
                            <div><a >3</a></div>
                            <div><a >4</a></div>
                            <div><a >5</a></div>
                            <div><a >6</a></div>
                            <div><a >7</a></div>&ndash;&gt;
                        </div>

                    </div>
                    <img src="./img/shortadd.png" class="addshortfilm">-->
                    <div id="shipin2">
                       <!-- <video id="shipin2video" src="" controls></video>-->
                    </div>

                    <img class="prev2" src="./img/yello-btn-left.png" alt=" ">
                    <div class="movies-2-ul">
                        <ul class="fanfan">
                            <!--<li><div><img src="./img/xiaohuli.jpg" alt=""></div><p><span>《小狐狸》</span><br>克蕾尔是一只可爱的小狐狸，它调皮可爱有点搞怪的
                                形象赢得了许多人的喜爱，让我们跟随它可爱的步伐
                                一起摇摆吧！</p></li>
                            <li><div><img src="./img/rpg.jpg" alt=""></div><p><span>《角色RPG》</span><br>无知的少年误闯入魔幻的游戏世界，有你熟知的游戏角
                                色，更有前所未有的冒险将就此展开！荣获于2005年金
                                闪客“最佳动画片奖”。</p></li>
                            <li><div><img src="./img/xiaoaoxuanyuan.jpg" alt=""></div><p><span>《笑翱轩辕》</span><br>《笑翱轩辕》以《轩辕二·飞天历险》为主题，与大宇
                                公司联合制作，其卡通公司精心打造的动画故事剧本，
                                充满了另类搞笑风格。该动画片诞生后，先后16周霸
                                榜网络动画排行榜冠军。</p></li>-->
                        </ul>
                    </div>
                    <img class="next2" src="./img/yello-btn-right.png" alt=" ">
                </div>
            </div>
            <div class="movies-4">
    <!--            <div class="big-bg4">
                    <img src="" alt="" class="movies-4-bg">
                </div>-->
                <div class="movies-4-control">
                    <div class="adposter"><img src=""></div>
                    <div class="shipinmask4"></div>
                    <div id="shipin4">
                        <!--<video id="shipin4video" src="" controls></video>-->
                    </div>

                    <img class="prev4" src="./img/yellow-left2.png" alt=" ">
                    <div class="movies-4-bg2"></div>
                    <div class="movies-4-ul">
                        <ul class="fanfan4">
                            <!--<li><div><img src="./img/xiaohuli.jpg" alt=""></div><p><span>《小狐狸》</span><br>克蕾尔是一只可爱的小狐狸，它调皮可爱有点搞怪的
                                形象赢得了许多人的喜爱，让我们跟随它可爱的步伐
                                一起摇摆吧！</p></li>
                            <li><div><img src="./img/rpg.jpg" alt=""></div><p><span>《角色RPG》</span><br>无知的少年误闯入魔幻的游戏世界，有你熟知的游戏角
                                色，更有前所未有的冒险将就此展开！荣获于2005年金
                                闪客“最佳动画片奖”。</p></li>
                            <li><div><img src="./img/xiaoaoxuanyuan.jpg" alt=""></div><p><span>《笑翱轩辕》</span><br>《笑翱轩辕》以《轩辕二·飞天历险》为主题，与大宇
                                公司联合制作，其卡通公司精心打造的动画故事剧本，
                                充满了另类搞笑风格。该动画片诞生后，先后16周霸
                                榜网络动画排行榜冠军。</p></li>-->
                        </ul>
                    </div>
                    <img class="next4" src="./img/yellow-right2.png" alt=" ">
                </div>
            </div>
        </div>
        <div class="st-panel" id="st-panel-3">
<!--            <div id="light">
                <a href="light.html" name="#light">亮点 HIGHLIGHT</a>
            </div>-->
            <div id="light">
                <a href="light.html" name="#light"></a>
            </div>
            <div class="light-1" >
                <img class="prev3" src="./img/yellow-left.png">
                <div class="light-control">
                    <ul class="fanfanfan">
 <!--                       <li>
                            <span>01</span>
                            <h3>《萤火奇兵》曝光主题曲MV 周子琰献唱</h3>
                            <p>当月光洒在了我的身上，我懒洋洋抖抖翅膀，露珠滑过我的肩膀”周子琰清澈甜美的歌声回荡耳边，画面中穿梭在黑夜上空的“光明使者”.....</p>
                            <img src="./img/1.png" alt="">
                        </li>
                        <li>
                            <span>02</span>
                            <h3>《萤火奇兵》曝光主题曲MV 周子琰献唱</h3>
                            <p>当月光洒在了我的身上，我懒洋洋抖抖翅膀，露珠滑过我的肩膀”周子琰清澈甜美的歌声回荡耳边，画面中穿梭在黑夜上空的“光明使者”.....</p>
                            <img src="./img/2.png" alt="">
                        </li>
                        <li>
                            <span>03</span>
                            <h3>《萤火奇兵》曝光主题曲MV 周子琰献唱</h3>
                            <p>当月光洒在了我的身上，我懒洋洋抖抖翅膀，露珠滑过我的肩膀”周子琰清澈甜美的歌声回荡耳边，画面中穿梭在黑夜上空的“光明使者”.....</p>
                            <img src="./img/3.png" alt="">
                        </li>-->
                    </ul>
                </div>

                <img class="next3" src="./img/yellow-right.png">
            </div>
        </div>
<!--        <div class="st-panel st-color" id="st-panel-4">

            <h2>求贤</h2>
        </div>
        <div class="st-panel" id="st-panel-5">

            <h2>合作</h2>
        </div>-->
    </div>
    <div class="mask">
        <div id="wocha">x</div>
        <div class="videosize">
        </div>
    </div>
    <div class="bodymask">
        <div id="wocha2">x</div>
        <div class="bodyvideosize"></div>
    </div>
    <footer>
        <div class="footer-left">
            <div class="footer-img">
                <ul>
                    <li><img src="./img/weixin.png" alt=""><a>itscartoon_2002</a></li>
                    <li><img src="./img/email.png" alt="" ><a>here@itscartoon.com</a></li>
                    <li><img src="./img/weibo.png" alt=""><a href="http://weibo.com/u/1781297385?topnav=1&wvr=6&topsug=1">http://weibo.com/u/1781297385?topnav=1&wvr=6&topsug=1</a></li>
                    <li><img src="./img/logo-bottom.png" alt=""></li>
                </ul>
            </div>

        </div>
        <div class="footer-right">
            <div class="footer-right-son" >
                <span>京ICP备字-01092817</span>
                <img src="img/logo-bottom-right.png" alt=""><br>
                <span>©<a href="#"> ITSCARTOON</a>· Animation.All rights reserved</span>
            </div>
        </div>
    </footer>
</div>
<span class="back-top" style="position: fixed;right: 30px;bottom: 30px;width: 80px;height: 48px;background-color: #ffb90f;border: 1px solid #888;color: #fff;text-align: center;line-height: 48px;">返回顶部</span>
<script src="js/backtop.js"></script>
</body>
</html>